<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>${novel.name}</title>
    <link href="${pageContext.request.contextPath}/static/css/bookdetails-1.css" rel="stylesheet" type="text/css">
    <link href="${pageContext.request.contextPath}/static/css/bookdetails-2.css" rel="stylesheet" type="text/css">
    <script src="${pageContext.request.contextPath}/static/tool/jquery.js"></script>
    <script src="${pageContext.request.contextPath}/static/js/bookdetails-1.js"></script>
    <script src="${pageContext.request.contextPath}/static/js/bookdetails-list.js"></script>
    <script src="${pageContext.request.contextPath}/static/js/bookdetails-comment.js"></script>


</head>

<body>
    <jsp:include page="../common/head.jsp"></jsp:include>
    <!--头部结束-->

    <div class="box clear">
        <div class="list">
            <div class="pos">
                当前位置：<a href="${pageContext.request.contextPath}/guest/main">首页</a>
                > <a href="${pageContext.request.contextPath}/guest/type/list/${novel.type}/1">${novel.typeName}</a>
                > ${novel.name}
            </div>
            <h3>${novel.name}</h3>

            <ul class="tab clear">
                <li class="active"><a href="#">简介</a></li>
                <li><a href="#">章节目录<b>(${novel.chapter})</b></a></li>
                <li><a href="#">评论<b>(${commentCount})</b></a></li>
            </ul>
            <div class="tab_1">
                <div class="info clear">
                    <img src="${pageContext.request.contextPath}/static/images/${novel.fileName}" class="left" style="margin-right:20px;width:150px;">
                    <p class="left" style="width:580px; overflow:hidden;">${novel.desc}
                    </p>
                </div>
                <div class="fx clear">
                    <p class="dsf">
                        <c:if test="${novel.status == 0}"><span class="badge" style="background-color: #00d20d">连载中</span></c:if>
                        <c:if test="${novel.status == 1}"><span class="badge" style="background-color: #7e2c2c">完结</span></c:if>

                        <button  class="btn btn-danger"><a style="color: white" href="${pageContext.request.contextPath}/authen/read/1/${novel.id}">开始阅读</a> </button>
                        <a href="${pageContext.request.contextPath}/authen/like/${novel.id}" style="width:113px">
                            <c:if test="${likes == 'true'}"> <span style="font-size: 20px;color: red"  class="glyphicon glyphicon-thumbs-up"></span>点赞 <em>(${novel.likes})</em></c:if>
                            <c:if test="${likes == 'false'}"> <span style="font-size: 20px;color: dodgerblue"  class="glyphicon glyphicon-thumbs-up"></span>点赞 <em>(${novel.likes})</em></c:if>
                        </a>
                        <a  title="加入书架" href="${pageContext.request.contextPath}/authen/collect/${novel.id}" class="sc_c">
                            <c:if test="${collect == 'true'}"><span style="font-size: 20px;color: red"  class="glyphicon glyphicon-star"></span>收藏<b>+1</b></a></c:if>
                            <c:if test="${collect == 'false'}"><span style="font-size: 20px;color: dodgerblue"  class="glyphicon glyphicon-star-empty"></span>收藏<b>+1</b></a></c:if>

<%--                        <b> 分享到:</b>--%>
                    </p>
                </div>
                <ul class="clear info_1">
                    <p>基本信息</p>
                    <li><span>作 &nbsp; &nbsp; &nbsp; 者：</span>${author.username}</li>
                    <li><span>作品总数：</span>1</li>
                    <li><span>更新状态：</span><c:if test="${novel.status == 0}">连载</c:if><c:if test="${novel.status == 1}">完结</c:if></li>
                    <li><span>类 &nbsp; &nbsp; &nbsp; 型：</span>${novel.typeName}</li>
                    <li><span>章 &nbsp; &nbsp; &nbsp; 节：</span>${novel.chapter}</li>
                    <li><span>字 &nbsp; &nbsp; &nbsp; 数：</span>${novel.word}</li>
                    <li><span>出版时间：</span><fmt:formatDate value="${novel.createTime}" pattern="yyyy-MM-dd"/> </li>
                    <li><span>评 &nbsp; &nbsp; &nbsp; 价：</span>${commentCount}人评论</li>
                </ul>
            </div>
            <!--简介介绍-->

            <div class="tab_1">
                <div class="tit">章节目录<b>(${novel.chapter})</b></div>
                <div class="info_1">
                    <ul class="clear">
                        <p>详&ensp;&ensp;&ensp;&ensp;情</p>
                        <c:forEach items="${chapters[0]}" var="chapter">
                            <li><a href="${pageContext.request.contextPath}/authen/read/${chapter.chapterNo}/${novel.id}">${chapter.chapterName}</a></li>
                        </c:forEach>
                    </ul>
                    <ul class="clear tab_list">
                        <p>其&ensp;&ensp;&ensp;&ensp;他</p>
                        <c:forEach items="${chapters[1]}" var="chapter">
                            <li><a href="${pageContext.request.contextPath}/authen/read/${chapter.chapterNo}/${novel.id}">${chapter.chapterName}</a></li>
                        </c:forEach>
                    </ul>
                </div>
                <div id="up" class="clear"><a href="javascript:;"><samp>查看全部</samp><span class="icon ease"></span></a></div>
            </div>
            <!--章节目录-->

            <div class="tab_1 ">
                <div class="tit">评论<b>(${commentCount})</b></div>
            </div>
            <div class="comment">
                <ul class="com_con clear">
                    <c:forEach items="${comments.data}" var="comments">
                        <div class="com_bor">
                            <li class="go">
                                <div class="com_1 clear">
                                    <div class="portrait left">
                                        <img src="${pageContext.request.contextPath}/static/img/logo.jpg"><br/>
                                        <span>${comments.parentComment.username}</span>
                                    </div>
                                    <div class="word left kdit_w">
                                        <p class="time">${comments.parentComment.quarterNoZh} ${comments.parentComment.chapterNoZh}评论：</p>
                                        <p>${comments.parentComment.content}</p>
                                        <p class="right"><a href="javascript:;">回复</a>
                                            <a href="javascript:;" class="red">展开回复</a><time><fmt:formatDate value="${comments.parentComment.createTime}" pattern="yyyy-MM-dd HH:mm:ss"/></time></p>
                                    </div>
                                </div>
                                <!--评论内容-->
                                <div class="com_con clear hui">
                                    <div class="portrait left mar_top">
                                        <img src="${pageContext.request.contextPath}/static/img/avatar.jpg"><br/>
                                        <span>当前用户回复</span>
                                    </div>
                                    <form action="${pageContext.request.contextPath}/authen/childComment" method="post" class="right kdit_w_550">
                                        <input type="hidden" name="isParent" value="false">
                                        <input type="hidden" name="novelId" value="${comments.parentComment.novelId}">
                                        <input type="hidden" name="charterId" value="${comments.parentComment.chapterId}">
                                        <input type="hidden" name="replyId" value="${comments.parentComment.userId}">
                                        <input type="hidden" name="replyName" value="${comments.parentComment.username}">
                                        <input type="hidden" name="authorId" value="${novel.authorId}">
                                        <input type="hidden" name="parentId" value="${comments.parentComment.id}">
                                        <textarea name="content">发表评论</textarea>
                                        <p></p>
                                        <input type="submit" value="提交" class="ease">
                                    </form>
                                </div>
                                <!--回复框-->
                            </li>
                            <!--第一条评论内容-->
                            <c:forEach items="${comments.childComment}" var="comment">
                                <li class="go2">
                                    <div class="come">
                                        <div class="com_con clear hui2">
                                            <div class="portrait left">
                                                <img src="${pageContext.request.contextPath}/static/img/avatar.jpg"><br/>
                                                <span><c:if test="${comment.isAuthor == 'true'}">作者${comment.username}</c:if> <c:if test="${comment.isAuthor == 'false'}">${comment.username}</c:if></span>
                                            </div>
                                            <div class="word left">
                                                <p><span class="user"><c:if test="${comment.isAuthor == 'true'}">作者${comment.username}</c:if> <c:if test="${comment.isAuthor == 'false'}">${comment.username}</c:if>
                                                    回复 ${comment.replyName}：</span>
                                                    ${comment.content}</p>
                                                <p class="right"><a href="javascript:;">回复</a><time><fmt:formatDate value="${comment.createTime}" pattern="yyyy-MM-dd HH:mm:ss" /> </time></p>
                                            </div>
                                        </div>
                                        <!--回复内容-->
                                        <div class="com_con clear hui">
                                            <div class="portrait left mar_top">
                                                <img src="${pageContext.request.contextPath}/static/img/avatar.jpg"><br/>
                                                <span><c:if test="${comment.isAuthor == 'true'}">作者${comment.username}</c:if> <c:if test="${comment.isAuthor == 'false'}">${comment.username}</c:if></span>
                                            </div>
                                            <form action="${pageContext.request.contextPath}/authen/childComment" method="post" class="right kdit_w_550">
                                                <input type="hidden" name="isParent" value="false">
                                                <input type="hidden" name="novelId" value="${comments.parentComment.novelId}">
                                                <input type="hidden" name="charterId" value="${comments.parentComment.chapterId}">
                                                <input type="hidden" name="replyId" value="${comments.parentComment.userId}">
                                                <input type="hidden" name="replyName" value="${comments.parentComment.username}">
                                                <input type="hidden" name="authorId" value="${novel.authorId}">
                                                <input type="hidden" name="parentId" value="${comments.parentComment.id}">
                                                <textarea name="content">发表评论</textarea>
                                                <p></p>
                                                <input type="submit" value="提交" class="ease">
                                            </form>
                                        </div>
                                        <!--回复框-->
                                    </div>
                                </li>
                            </c:forEach>

                            <!--第一条评论的所有回复-->
                        </div>
                    </c:forEach>

                    <!--      -第一条评论    -->
                </ul>
                <ul class="page clear">
                    <c:choose>
                        <c:when test="${comments.currentPage > 1 }">
                            <li><a href="${pageContext.request.contextPath}/guest/book/${novel.id}/${comments.currentPage-1 }">上一页</a></li>
                        </c:when>
                        <c:otherwise>
                            <li><a href="#">上一页</a></li>
                        </c:otherwise>
                    </c:choose>
                    <c:forEach var="p" begin="1" end="${comments.pageCount }">
                        <li><a href="${pageContext.request.contextPath}/guest/book/${novel.id}/${p }">${p }</a></li>
                    </c:forEach>
                    <c:choose>
                        <c:when test="${comments.currentPage < comments.pageCount }">
                            <li><a href="${pageContext.request.contextPath}/guest/book/${novel.id}/${comments.currentPage+1 }">下一页</a></li>
                        </c:when>
                        <c:otherwise>
                            <li><a href="#">下一页</a></li>
                        </c:otherwise>
                    </c:choose>
                    <li><a href="${pageContext.request.contextPath}/guest/book/${novel.id}/${comments.pageCount }">末页</a></li>
                </ul>
                <!--分页-->

            </div>
            <!--评论结束-->


        </div>
        <!--右边结束-->
        <div class="list2">
            <div class="one">
                <p>新书上架</p>
                <div class="notice">
                    <ul>
                        <c:forEach items="${newNovels}" var="novel">
                            <li><a href="${pageContext.request.contextPath}/guest/book/${novel.id}/1">${novel.name}</a>
                                <span class="pull-right"><fmt:formatDate value="${novel.createTime}" pattern="yyyy-MM-dd"/></span>
                            </li>
                        </c:forEach>
                    </ul>
                </div>
            </div>
            <!--新书上架结束-->

            <div class="two">
                <p><a href="javascript:;" class="active">本周最热排行</a></p>
                <ul class="active">
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">谢谢你曾来过我的世界</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                </ul>
                <ul>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">谢谢你曾来过我的世界</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">谢谢你曾来过我的世界</a></li>
                </ul>
            </div>
            <!--tab切换-->

            <div class="three">
                <p>相关文章</p>
                <ul>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">谢谢你曾来过我的世界</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                    <li><a href="javascrip:;">文化苦旅</a></li>
                </ul>
            </div>
        </div>
        <!--左边结束-->
    </div>
    <!--中间box 结束-->


    <footer class="clear">


    </footer>
    <!--底部结束-->
</body>
<script>
    <c:if test="${com == 'true'}">
    layer.msg("评论成功");
    </c:if>
    <c:if test="${add == 'fasle'}">
    layer.msg("操作失败");
    </c:if>
</script>

</html>